Abram Hindle 

Department of Computing Science 
University of Alberta 

MVC and Android 


Slides originally by Ken Wong 


Images reproduced in these slides have been included under section 29 of 
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MVC Framework 


Who is in Control? 

• Class library reuse 

° application developers: 

D write the main body of the application 
0 reuse library code by calling it 

• Framework reuse 

° application developers: 

D reuse the main body of the application 
D write code that the framework calls 
D reuse library code by calling it 
























































































































































Framework 


• Separation of concerns: 

° framework 

0 skeletal application code 
0 general superclasses and interfaces 

°your "customizations” 

D specific subclasses and implementations 

















































































































































































































































Exercise 

• Design an MVC framework for 
building interactive applications 
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Filler Creep Game 

• The universe is filled with stuff 

• You (Yin) fight Yang for the fundamental 
stuff that forms the universe. 

• You can only consume what you touch 

• You will beat Yang if you consume more 
than Yang. 

• 4 kinds of stuff: energy, matter, dark 
matter and dark energy (I guess you're 
some of space) 

• https://github.com/abramhindle/FillerCre 
epForAndroid 
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Filler Creep Game 

• We're going to use MVC 

• Model 

• The universe and game rules 

• Views 

• Text View, Graphical View 

• Controller 

• Game interaction rules 

• Access to model 




















































































































































































The Generic Model 


public class FModel<V extends FView > { 
private ArrayList<V> views; 
public FModelo { 

views = new ArrayList<V>(); 

} 

public void addView(V view) { 
if (! views .contains(view)) { 
views .add(view); 

} 

} 

public void deleteView (V view) { 
views .remove( view ); 

} 

public void notifyViews() { 
for (V view : views) { 
view.update( this ) : 



} 


} 












































































































































































































































































































































































































































































































































































































































































































































































The Generic View 


public interface FView<M> { 
public void update( M model); 

} 
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The Less Than Generic 
Controller 


// The purpose is to decouple the Views 
// from the Model and save them from 
// changes made to the model 
public interface FController { 
public boolean isGameOver(); 
public int[] getScoresO; 
public int whichPlayerNumberWins(); 
public Player[] getPlayers(); 
public Bitmap getMapBitmap(); 
public void playRound(FundamentalStuff 
choice); 

public String [] getGameScoreStrings(); 


} 






































































































































































































































































The Application 

public class FillerCreepApplication extends Application { 

// Singleton 

transient private static FillerCreep fillerCreep = null; 

static FillerCreep getFillerCreep() { 
if {fillerCreep == null) { 

fillerCreep = new FillerCreep(); 

} 

return fillerCreep; 

} 

// Singleton 

transient private static GameController gameController = null; 

public static GameController getGameController() { 
if {gameController == null) { 

gameController = new GameController(getFinerCreep()); 

} 

return gameController; 

} 

(aOverride 

public void onCreate() { 
super .onCreate(); 


} 


} 







































































































































































































































































































































































The Application 

• The application in Android allows us 
to save local state in memory without 
communicating through intents. 

• We have our singletons here. We will 
forget them if the application 
terminates. 

• Need to add the application class 
name in the android.xml 

<application 

android: r\3me='' FillerCreepApplication" 
android: icor\='' (ddrawable/ic_launcher '' 
android: \abe\=''^string/app_nanie'' > 

























































































































































































































































































































































































Our Model 

^ Si FiUerCreep 
^ nPlayers 
^ stuFFArray 

e? riUFlood(FundamentalSturF[][], int, int, Fundar 
A® getStuFFArrayO : FundamentalStuFF[] 
inBounds(FundamentalStuFF[][], int, int) : bool 
e? stackFulFiUFlood(FundamentalStuFF[][], int, ini 
e? stacklessFiUFlood(FundamentalStuFF[][], int, ii 
i height 
players 
scores 
universe 
i width 
^ FillerCreepO 
^ FiUerCreep(int, int) 

■ cloneUniverseO : Fundam!entalStuFF[][] 

■ FiUFlood(int, int, FundamentalStuFF, Fundament: 
o gameOverO : boolean 
o getHeightO : int 
o getPlayersO : Player[] 
o getScoresO : int[] 


^ FillerCreep(int, int) 

■ cloneUniverseO ■ FundamentaLstuFF[][] 

■ FillFlood(int, int, FundamentalStuFF, Func 
9 gameOverO : boolean 

9 getFleightO : int 
9 getPlayersO ■ Pl3yer[] 

9 getScoresO : int[] 

9 getUniverseO : FundamentalStuFF[][] 

9 getWidthO : int 
^ inBounds(int, int) : boolean 

■ initO:void 

9 playAIPlayer(int) : int 
9 playPlayer(int, FundamentalStuFF) : int 
playPlayer(Player, FundamentalStuFF) : ii 
^ playRoundWithAI(int, FundamentalStuFF 
9 resetGameO : void 

9 testPlayerPlay(int, FundamentalStuFF) : i 
^ testPlayerPlay(Player, FundamentalStuF 

■ updateScore(Player, int) : void 
9 whichPlayerNumberWinsO : int 
9 whichPlayerWinsO : Player 

















An example View 


public class FillerCreepGraphicalViewActivity extends Activity implements 
FView<FillerCreep> { 

/** Called when the activity is first created. */ 

(aOverride 

public void onCreate(Bundle savedInstanceState) { 
super. onCreate(savedlnstanceState); 
setContentView(R.layout .graphicalview) ; 

ImageButton button = (ImageButton) fin6\lieviByl6{R.i6.maingraphicalview); 
OnClickListener listener = new OnClickListener() { 
public void onClick(View v) { 
finish(); 

} 

}; 

button.setOnClickListener(listener); 

FillerCreep fc = FillerCreepApplication.gfetFiZZerCreep(); 
fc. addView(this) ; 

updateMap(); 

} 

(aOverride 

public void onDestroyO { 
super. onDestroy(); 

FillerCreep fc = FillerCreepApplication.gfetFiZZerCreep(); 
fc. deleteView(this) ; 

} 

public void update(FillerCreep fillerCreep) { 
updateMap(); 

} 

public void updateMapO { 

ImageButton button = (ImageButton) fin6\lieviByl6{R.i6.maingraphicalview); 
GameController gc = FillerCreepApplication.gfet6ameControZZer(); 

Bitmap bitmap = gc.getMapBitmapO; 
button.setlmageBitmap(bitmap); 




































































































































































































































































































































































































































public class FillerCreepGraphicalViewActivity extends Activity implemei #^ FView<FillerCreep> 
/** Called when the activity is first created. */ 

(aOverride 

public void onCreate(Bundle savedInstanceState) { 
super .onCreate(savedlnstanceState); 
setContentView(R.layout .graphicalview ) ; 

ImageButton button = (ImageButton) findViewByld(R.id.maingfraphicaZview) ; 
OnClickListener listener = new OnClickListener() { 
public void onClick(View v) { 
finish(); 



public void update(FillerCreep fillerCreep) { 
updateMap(); 

} 


public void updateMapO { 

ImageButton button = (ImageButton) fin6\lieviByl6{R.i6.maingraphicalview); 
GameController gc = FillerCreepApplication.gfet6ameControZZer(); 

Bitmap bitmap = gc.getMapBitmapO; 
button.setlmageBitmap(bitmap); 


} 


} 








































































































































































































































































































































































Example View/Controller 

public class FillerCreepTextViewActivity extends Activity implements / 

FView<FillerCreep> { / / 

/** Called when the activity is first created. / 

O Override /y / 

public void onCreate(Bundle savedInstanceStat4V { / 

super. onCreate(savedlnstanceState); / / 

setContentView(R.layout. textinterface) i/ 

Button button = (Button) findViewByicl(R.id. textdar/cenergy) ; / 

button. setOnClickListener(new OtiClickListener() { / 

(aOverride / / / 

public void onClick(ViewargB) { / 

play(new DarkEnergyt))/ / 

}); // ^ / 

III / / / 

updateScores(); / / / 

FillerCreep fc = ^llerCreepApplication .getFinerCreep(); / 

fc.addView(this); / / 

public void update(Fil]rerCreep fillerCreep) { / 

updateScores(); / 

} / 

(aOverride / 

public void onDestroyO { / 

super. onDestroy(); / 

FillerCreep fc = FillerCreepApplication.getFiZ(erCreep(); / 

fc.deleteView(this); / 

} / 

void play(FundamentalStuff choice) { / 

GameController gc = FillerCreepApplication.getGameControZZerO;/ 

gc.playRound(choice); / 

} 

void updateScores() { / 

TextView scorel = (TextView) findViewById(R.id. textyin ); / 

TextView score2 = (TextView) findViewByld(R.id.textyang) ; » 

TextView[] tscores = new TextView[] { scorel, score2 }; ' 

GameController gc = FillerCreepApplication.getGa/7?eControZIer(); 

String[] scores = gc.getGameScoreStrings(); 
for (int i = 0; i < tscores. length ; i++) { 
tscores[i].setText(scores[i]); 

I 









































































































































































































































































































































































Each Activity Must Be 

Declared! 

From AndroidManifest.xml 
octivity 

android:name=" . FillerCreepActivity" 
android: \abe\=''§st ring/app_naiTie'' > 

<intent-filter> 

<action ar\6roi6:r\ame=''android . intent. action .MAIN" /> 

<category ar\droid:r\ame="android. intent. category. LAUNCHER" /> 
</intent-filter> 

</activity> 

<activity 

android:name=" . FillerCreepTextViewActivity" 
android :\abe\="§string/app_naiTie" > 

<intent-filter> 

</intent-filter> 

</activity> 

<activity 

android:name=" . FillerCreepGraphicalViewActivity" 
and roid: \abe\="§st ring/app_naiTie" > 

<intent-filter> 

</intent-filter> 

</activity> 

<activity 

android:name=" . FillerCreepGraphicalGameActivity" 
and roid: \abe\="§st ring/app_naiTie" > 

<intent-filter> 

</intent-filter> 

</activity> 





















































































ImageButtons! 


<ImaaeButton 

android 
android 
android 
android 
android 


► iJj FillerCreepActivity.java 

► FillerCreepApplication java 

► ^ FillerCreepGraphicalGameActivity.java 

► FillerCreepGraphicalViewActivity.java 

► ^ FillerCreepTextViewActivity.java 

► ^ FModel.java 

► FundamentalSturf.java 

► FundamentalStLrFColorMap.java 

► FView.java 

► GameControUer.java 

► GraphicalFillerCreepView.java 

► IntPoirt.java 

► ® MaLter.java 

► ® Player.java 

► ®Yang.java 

► ®Yin.java 

► gen [Generated Java Files] 

► Bii Android 2.1 

► ^ibin 
’Is res 

^ Gjdrawable-hdpi 


dark energy.png 


dark matter.png 
Wn energy.png 
ic laLncher.png 
(^i^matter.png 
^ £jdrawable-ldpi 



ll Palette 

^ Form Widgets 


TextView 



i(i=''(d+icl/ gameda rkdne rgy" 
layout_width="fiIZ _parent" 
layout_height="ivrap_content" 
s rc="^drawable/ dam_energy" 
te'yt=''(dstring/darkanergy'' /> 


Medium Small 



RadioButton 


CheckedTextView 


CD Text Fields 
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CD Transitions 


CD Advanced 


CD Custom & Library Views 
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Exercise 



Design an MVC framework for 
building interactive applications 





































































































































































































































































































































































































